<template>
    <el-card shadow="never" style="border: 0;">
        <yun-form
            :columns="columns"
            ref="yunform"
            @submit="onSubmit"
        >
            <template #default>
                {:token_field()}
            </template>
            <template #spec="{rows}">
                <el-form-item label="配置价格:">
                    <el-table :data="spec">
                        <el-table-column prop="name" label="规格"></el-table-column>
                        <el-table-column prop="price" label="单价">
                            <template #default="{row}">
                                <el-input v-model="row.price" type="number">
                                    <template #append>元/{{row.unit}}</template>
                                </el-input>
                            </template>
                        </el-table-column>
                    </el-table>
                </el-form-item>
            </template>
        </yun-form>
    </el-card>
</template>
<script>
    import form from "@components/Form.js";
    export default{
        components:{
            'YunForm':form
        },
        data:{
            customer_id:'',
            spec:[],
            columns:[
                {"field":"customer_id","title":"ID","edit":"hidden"},
                {"field":"goods_id","title":"配置商品","edit":{form:'selectpage',url:'delivery/goods/index',labelField:'name',keyField:'id',change:'changeGoods'},"rules":"required"},
                {"field":"spec","title":"选择规格","edit":'slot'}
            ]
        },
        onLoad(e){
            this.customer_id=e.customer_id;
        },
        methods: {
            changeGoods:function (e){
                Yunqi.ajax.get('delivery/channel-customer-goods/goodsinfo',{goods_id:e}).then(res=>{
                    this.spec=res.spec;
                })
            },
            onSubmit:function (){
                if(this.spec.length==0){
                    Yunqi.message.error('请选择规格');
                    return false;
                }
                for(let i in this.spec){
                    if(!this.spec[i].price){
                        Yunqi.message.error('请填写规格价格');
                        return false;
                    }
                }
                this.$refs.yunform.setValue('spec',this.spec);
                this.$refs.yunform.setValue('customer_id',this.customer_id);
                return true;
            }
        }
    }
</script>
<style>
    
</style>

